<template>
  <div>
    {{this.$store.getters.getCounts}}
  </div>
</template>

<script>
  /**
   * 从 store 中的 state 中派生出一些状态.
   所解决问题：如果有多个组件需要用到此属性，我们要么复制这个函数，或者抽取到一个共享函数然后在多处导入它
   mapGetters 辅助函数
   mapGetters 辅助函数仅仅是将 store 中的 getter 映射到局部计算属性
   */
  //导入vuex中的mapGetter辅助函数
  import {mapGetters} from 'vuex';
  export default {
    name: "MapGetterTest",
    computed:{
      //将vuex--getter中的方法getCounts映射到局部计算属性
      ...mapGetters(['getCounts'])
    }

  }
</script>

<style scoped>

</style>
